<template>
<div class="choose-list">
  <div class="table-data">
    <v-table
        :list="tableData"
        :tag="tag"
        :list-loading="listLoading"
        :filter-column="filtercolumn"
        @handleSelectionChange="select"
    ></v-table>
  </div>
  <div class="page">
    <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="listQuery.page"
        :limit.sync="listQuery.limit"
        @pagination="getList"
    />
  </div>
</div>
</template>

<script>
import { queryPage } from '../api'
import Pagination from '@/components/Pagination'
import VTable from '@/components/Table'
export default {
  name: 'LiveList',
  props:{
    type:{
      type:String,
      default:''
    }
  },
  components: { Pagination, VTable},
  data(){
    return{
      listLoading:false,
      total:0,
      tableData:[],
      listQuery: {
        page: 1,
        limit: 10
      },
      tag:''
    }
  },
  created() {
    if(this.type==='live'){
      this.tag='liveIndex'
    }else{
      this.tag='cxgzs'
    }
    this.getList()
  },
  methods:{
    select(arr){
      this.$emit('select',arr)
    },
    getList() {
      this.listLoading = true
      var query = {
        page:  this.listQuery.page,
        pageSize: this.listQuery.limit
      }
      if(this.type==='live'){
       query['publishStatus'] = "GIPSTSTUS01,GIPSTSTUS03"
      }else{
        query['status'] = "GIPSTSTUS01"
      }
      return new Promise((resolve, reject) => {
        queryPage(this.type,query)
            .then((response) => {
              this.tableData = response.data.data.rows
              this.total = response.data.data.total
              this.listLoading = false
            })
            .catch((error) => {
              reject(error)
              this.listLoading = false
            })
      })
    },
    filtercolumn(scope, item) {
      if (item === 'cyrsrc') {
        return (
            scope.row['joinPeopleNumber'] + '/' + scope.row['joinPeopleTime']
        )
      }
      if (item === 'liveStartTime' || item === 'liveEndTime') {
        return (scope.row[item] && scope.row[item].substring(0, 16)) || ''
      } else {
        return scope.row[item]
      }
    },
  }
}
</script>

<style type="text/css" lang="scss">
.choose-list{
  height: 550px;
  display: flex;
  flex-direction: column;
  .table-data{
    flex: 1;
  }
  .page{
    height: 50px;
  }
}
</style>
